import router from "@/router";
import store from "@/store";
import NProgress from "nprogress"; // 路由跳转的进度条
import "nprogress/nprogress.css"; // 路由跳转的样式
// const whiteList = ['/login', '/404'];
const whileList = ["/login", "/404"];
// 借助路由守卫来对路由跳转做路由的权限拦截
router.beforeEach(async( to, from, next) => {
  NProgress.start();
  if (store.getters.token) {
    //     // 是去首页页面，直接跳转首页
    if (to.path === "/login") {
      next("/");
    } else {
      // 如果不是去登录页面，直接放行
      // 如果当前vuex中有用户的资料的id表示，已经有资料了，不需要再获取
      // console.log(11111,store.getters.userInfo.userId);
      if(!store.getters.userId){
        // 没有的话，触发actions获取请求
       const { roles } = await store.dispatch('user/getUserInfo')
       console.log(roles,5555);
       const routes = await store.dispatch('permission/filterRoutes', roles.menus)
       console.log(routes,333333);
       // routes就是筛选得到的动态路由
       // 动态路由 添加到 路由表中 默认的路由表 只有静态路由 没有动态路由
       // addRoutes  必须 用 next(地址) 不能用next()
       router.addRoutes([...routes, { path: '*', redirect: '/404', hidden: true }]) // 添加到路由表
       // 添加完动态路由之后
       next(to.path) // 相当于跳到对应的地址  相当于多做一次跳转 为什么要多做一次跳转
      }
      
      next();
    } // 如果没有Token
  }else {
    if (whileList.indexOf(to.path) > -1) {
      // 表示在白名单里面
      next()
    } else {
      next('/login')
    }
  }
  NProgress.done()
});
router.afterEach(() => {
  NProgress.done()
})